<template>
	<div class="tips">
		<div>
			<img src="images/Frame_pwd.png" alt="" />
		</div>
		<p class="top">
			{{ $t('informationPortal.noSetPwd', '您还未设置密码，建议您设置密码') }}
		</p>
		<p class="middle">
			{{
				$t(
					'informationPortal.setPwd',
					'设置后，可选择【手机号+密码】方式登录更为便捷'
				)
			}}
		</p>
		<button class="btn" @click="goCenterUser">
			{{ $t('informationPortal.goSet', '前往个人中心设置') }}
		</button>
		<p class="bottom" @click="know">
			{{ $t('informationPortal.notYet', '我知道了，暂不设置') }}
		</p>
	</div>
</template>
<script lang="ts">
import { apiInit } from '@/services'
import { defineComponent } from 'vue'
import { useRoute, useRouter } from 'vue-router'
import { i18n } from '@/locales'
const { $t } = i18n
export default defineComponent({
	props: {
		userId: {
			type: String,
			default: '',
		},
		tipType: {
			type: Array,
			default: [],
		},
	},
	emits: ['close'],
	setup(props, ctx) {
		const api = apiInit()
		const router = useRouter()
		const goCenterUser = () => {
			router.push('/PersonalCenter')
		}
		const know = async () => {
			if (props.tipType.includes('userCenter')) {
				const res = await api.default.HidePwdNoticeUserCenterPrivateV1GET({
					query: {
						centerUserId: props.userId,
					},
				})
			}
			if (props.tipType.includes('OrgSetPwd')) {
				await api.baseAuto.AddGuideUserPrivateV1POST({
					payload: ['org_pwd_has_set'],
				})
			}
			ctx.emit('close')
			//    sessionStorage.setItem("isRead","1")
		}
		return {
			goCenterUser,
			know,
		}
	},
})
</script>
<style lang="less" scoped>
.tips {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 440px;
	// height: 500px;
	padding: 30px;
	background: #ffffff;
	box-shadow: 0px 10px 10px rgba(186, 197, 227, 0.3);
	border-radius: 8px;
	img {
		// display: block;
		margin-top: 39px;
		width: 200px;
		height: 200px;
	}
	.top {
		margin-top: 23px;
		font-family: 'PingFang SC';
		font-style: normal;
		font-weight: 500;
		font-size: 20px;
		line-height: 28px;
		color: #1f2329;
		text-align: center;
	}
	.middle {
		margin-top: 10px;
		font-family: 'PingFang SC';
		font-style: normal;
		font-weight: 400;
		font-size: 14px;
		line-height: 28px;
		letter-spacing: 0.01em;
		color: #646a73;
		text-align: center;
	}
	.btn {
		margin: 33px 0 25px 0;
		width: 311px;
		height: 48px;
		background: #4c78fc;
		border-radius: 8px;
		border: none;
		font-size: 14px;
		color: #ffffff;
		cursor: pointer;
	}
	.bottom {
		font-family: 'PingFang SC';
		font-style: normal;
		font-weight: 500;
		font-size: 14px;
		line-height: 20px;
		color: #8f959e;
		cursor: pointer;
	}
}
</style>
